{% extends '@Default/layout.twig' %}


{% block content %}

    <h2>
    	<i class="fa fa-coffee right-padding-5"></i> Products Overview
    </h2>

    <div class="panel panel-success panel-animated">
        <div class="panel-heading">
            <h3 class="panel-title">Payment Ok</h3>
        </div>
        <div class="panel-body">

            <table class="table" id="tablePaid">
                <thead>
                <tr>
                    <th>Product</th>
                    <th>Project</th>
                    <th>Customer</th>
                    <th>Value</th>
                </tr>
                </thead>
                <tbody>
                {% for obj in products %}
                    {% if obj.getPaid() %}
                        <tr>
                            <td>
                                {{ obj.getName() }}
                            </td>
                            <td>
                                <a href="{{ app.urlFor('Projects-Products-List',{projectId:obj.getProject().getId()}) }}">
                                    {{ obj.getProject().getName() }}
                                </a>
                            </td>
                            <td>
                                <a href="{{ app.urlFor('Customers-Customer-Edit',{id:obj.getProject().getCustomer().getId()}) }}">
                                    {{ obj.getProject().getCustomer().getName() }}
                                </a>
                            </td>
                            <td>$ {{ obj.getValue()|number_format(2, '.', ',') }}</td>
                        </tr>
                    {% endif %}
                {% endfor %}
                </tbody>
            </table>

        </div>
    </div>


    <div class="panel panel-danger panel-animated">
        <div class="panel-heading">
            <h3 class="panel-title">Payment Pending</h3>
        </div>
        <div class="panel-body">

            <table class="table" id="tablePending">
                <thead>
                <tr>
                    <th>Product</th>
                    <th>Project</th>
                    <th>Customer</th>
                    <th>Value</th>
                </tr>
                </thead>
                <tbody>
                {% for obj in products %}
                    {% if not obj.getPaid() %}
                        <tr>
                            <td>
                                {{ obj.getName() }}
                            </td>
                            <td>
                                <a href="{{ app.urlFor('Projects-Products-List',{projectId:obj.getProject().getId()}) }}">
                                    {{ obj.getProject().getName() }}
                                </a>
                            </td>
                            <td>
                                <a href="{{ app.urlFor('Customers-Customer-Edit',{id:obj.getProject().getCustomer().getId()}) }}">
                                    {{ obj.getProject().getCustomer().getName() }}
                                </a>
                            </td>
                            <td>$ {{ obj.getValue()|number_format(2, '.', ',') }}</td>
                        </tr>
                    {% endif %}
                {% endfor %}
                </tbody>
            </table>

        </div>
    </div>

    <script type="text/javascript">
        jQuery( document ).ready( function( $ ) {
            var tablePaid = jQuery( "#tablePaid" );
            tablePaid.DataTable( {
                dom: 'Bfrtip',
                buttons: [
                    'copy', 'csv', 'excel', {
                        extend: 'pdfHtml5',
                        title: 'Payment Ok',
                        text: 'PDF'
                    }
                ]
            } );

            var tablePending = jQuery( "#tablePending" );
            tablePending.DataTable( {
                dom: 'Bfrtip',
                buttons: [
                    'copy', 'csv', 'excel', {
                        extend: 'pdfHtml5',
                        title: 'Payment Pending',
                        text: 'PDF'
                    }
                ]
            } );
        } );
    </script>

{% endblock %}